<!doctype html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>广告竞价渠道增加</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>

    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/>
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">
    <link rel="stylesheet" href="./css/style.css">
</head>

<body>

<div class="x-body">
    <form action="" class="layui-form layui-form-pane">
        <div class="layui-form-item">
            <label for="name" class="layui-form-label">
                投放平台 <span class="x-red">*</span>
            </label>
            <div class="layui-input-inline">
                <input type="text" id="name" name="name" required="" lay-verify="required"
                       autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label for="" class="layui-form-label">
                优化人
            </label>
            <div class="layui-input-inline">
                <select id="department" name="department" class="valid" lay-filter="province">
                    <option value=""></option>
                    <option value="22">策划</option>
                    <option value="33">销售</option>
                    <option value="44">11</option>
                    <option value="55">44</option>
                    <option value="66">444</option>
                    <option value="77">888</option>
                </select>
            </div>
            <div class="layui-input-inline peopleDown">
                <select id="people" name="people" class="valid">

                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <button  class="layui-btn" lay-filter="add" lay-submit="" style="margin-left:200px">
                增加
            </button>
        </div>
    </form>
</div>

<script type="text/javascript" src="./js/jquery-3.2.1.min.js"></script>
<script src="./lib/layui/layui.js" charset="utf-8"></script>
<script type="text/javascript" src="./js/xadmin.js"></script>
<script>
    function add() {

        layui.use('layer', function(){
            var layer = layui.layer;

            layer.open({
                type:2,
                title:'新增SEO渠道',
                area: ['600px']
                ,
                content:'admin-add.html',
                btn: ['保存', '取消']
                ,btnAlign: 'c'
                ,shade: 0
                ,yes: function(){
//                选择客户天数保存后的函数
                }
                ,btn2: function(){
                    layer.closeAll();
                }


            })

        });
    }
    //    下拉框
    //监听。这是文档里的方法，平常js无法操作select
    layui.use(['layer', 'form'], function () {
        var layer = layui.layer
            , form = layui.form;
        form.on('select(province)', function (data) {
//            console.log(data.elem); //得到select原始DOM对象
//            console.log(data.value); //得到被选中的值
            var sec = data.value;
            var add;//联动select的数组
            if (sec == "22") {
                add = new Array("wwww", "aaa");
            } else if (sec == "33") {
                add = new Array("fasfaf", "fdgadgasdgs");
            } else if (sec == "44") {
                add = new Array("陈达");
            } else if (sec == "55") {
                add = new Array("dasdsadsadsfdg", "ukuykruk");
            } else if (sec == "66") {
                add = new Array("资讯", "教育宝");
            }
//联动效果的实现
            if (add != null) {
                $("people").length = 0;
                $("#people>option").remove();
                for (var i = 0; i < add.length; i++) {
                    var ss = new Option();
                    ss.text = add[i].split()[0];
                    $("#people").append(ss);
//                    $("#yxDown").append(ss);
                    form.render('select');
                }
            }
        });
    });

    layui.use('laydate', function () {
        var laydate = layui.laydate;

        //执行一个laydate实例
        laydate.render({
            elem: '#start' //指定元素
        });

        //执行一个laydate实例
        laydate.render({
            elem: '#end' //指定元素
        });
    });
</script>

</body>

</html>